import React from 'react';
import styles from './index.module.less';
import { Button } from 'antd-mobile-v2';
import classnames from 'classnames';

enum ButtonType {
  PRIMARY = 'primary',
  GHOST = 'ghost',
  WARNING = 'warning'
}

interface ButtonItem {
  text: '确认';
  type?: ButtonType;
  className?: string;
  onClick: () => void;
  loading?: boolean;
}

const ButtonFooter: React.FC<any> = (props) => {
  const { data } = props;
  return (
    <div className={styles.wrap}>
      {
        data.map((item: ButtonItem, index: number) => (
          <Button
            key={index}
            className={classnames(styles.button, item?.className)}
            loading={item.loading}
            type={item.type || 'primary'}
            onClick={item.onClick}
          >{item.text}
          </Button>
        ))
      }
    </div >
  );
};

export default ButtonFooter;